<!DOCTYPE html>

<html>

    <head>

        <meta http-equiv='Pragma' content='no-cache'>
        <meta http-equiv='Cache-Control' content='no-cache'>
        <meta http-equiv='Expires' content='-1'>
        
        <title>Shop at Patchwork Gardens</title>

        <script src="js/jquery-1.8.2.min.js"></script>
        <script src="js/shopSite.js?version=2"></script>

        <link rel="stylesheet" type="text/css" href="css/shopSite.css">
        <link rel="stylesheet" type="text/css" href="css/modalBox.css">

    </head>


    <body>

        <div id="logoContainer">

            <div id="logoBorder1">

                <div id="logoBorder2">

                    <div id="logoBorder3">

                        <div id="logoImage"></div>
                        <div class="clear"></div>

                    </div>
                    <div class="clear"></div>

                </div>
                <div class="clear"></div>

            </div>
            <div class="clear"></div>

        </div>

        <div id="introductionText">Welcome to online ordering for Patchwork Gardens!  Feel free to email us at eat.patchworkgardens@gmail.com for questions or comments.</div>
        
        <div id="loginText">Please login using your email address so that we know who you are!</div>
        
        <div id="emailContainer">
            <input id="emailAddress" type="text"/>
        </div>
        
        <div id="loginButton">Login</div>

        <div id="instructionText">Below, you will see what produce we have at this time.  To order, update the 'Quantity' column for items you wish to purchase.  The price will update, and you may scroll down to select your payment and delivery options.  Thanks for stopping by, albeit virtually.</div>


        <div id="produceListContainer">
            <div id="produceListHeader">
                <div id="produceListTitle">Produce For Sale</div>
            </div>
            <div id="produceListColumnHeader">
                <div class="produceListColumnTitle">Item</div>
                <div class="produceListColumnTitle">Unit</div>
                <div class="produceListColumnTitle">Unit Price</div>
                <div class="produceListColumnTitle">Quantity</div>
                <div class="produceListColumnTitle">Available</div>
                <div class="produceListColumnTitle">Price</div>
                <div class="clear"></div>
            </div>
            <div id="produceList"></div>
            <div id="produceListFooter">
                <div id="produceListTotal">
                <div id="produceListTotalLabel">Total :</div>
                <div id="produceListTotalValue">$0.00</div>
                <div class="clear"></div>
                </div>
            </div>
        </div>

        <div id="paymentOptionsContainer">

            <div id="paymentOptionsTitle">Payment Options</div>

            <div id="paymentOptions">
                <input type="radio" name="payment" value="cashOnDelivery" checked>Cash or Check on Delivery</input><br/>
                <input type="radio" name="payment" value="cashByMail">Check by Mail</input>
            </div>
        </div>
        
        <div id="deliveryOptionsContainer">
            
            <div id="deliveryOptionsTitle">Delivery Options</div>
            
            <div id="deliveryOptionsText"></div>
            
        </div>

    </body>

</html>
